@import "./variable.scss";
.border-shaw {
    background-color: #ffffff;
    box-shadow: 0px 0px 15px 0px rgba(32, 30, 83, 0.2);
    border-radius: 5px;
}

.text-over {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

// flex layout
.flex-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

.flex-self-center {
    display: flex;
    align-self: center;
}

.flex-items-center {
    display: flex;
    align-items: center;
}

.flex-between-center {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

$align-content:(center:center, between:space-between, around:space-around, end:flex-end);
@each $type,
$value in $align-content {
    .flex-align-#{$type} {
        display: flex;
        align-content: $value;
        flex-wrap: wrap;
    }
}

$justify-content:(center:center, between:space-between, around:space-around, end:flex-end, start:flex-start);
@each $type,
$value in $justify-content {
    .flex-justify-#{$type} {
        display: flex;
        justify-content: $value;
        flex-wrap: wrap;
    }
}

.scrollbar-style {
    overflow-y: auto;
    &::-webkit-scrollbar-thumb {
        background-color: rgba(#1F2933, 0.0);
        border-radius: 6px;
        transition: background-color 0.6s;
    }
    &::-webkit-scrollbar {
        width: 6px;
        height: 10px;
        background-color: transparent;
        cursor: pointer;
    }
    &:hover::-webkit-scrollbar-thumb {
        background-color: rgba(#1F2933, 0.2);
    }
}

@mixin setScrollbar($color: #434b55, $bg-color: transparent, $w: 8px, $resizer-color: transparent) {
    &::-webkit-scrollbar-thumb {
        background-color: $rgba($color, 0.0);
        border-radius: $w;
    }
    &::-webkit-scrollbar {
        max-width: $w;
        width: $w;
        height: 10px;
        cursor: pointer;
        border-radius: $w;
        background-color: $bg-color;
    }
    &::-webkit-scrollbar-track-piece {
        border-radius: $w;
        background-color: $resizer-color;
    }
    &::-webkit-scrollbar-corner {
        background-color: $resizer-color;
    }
    &::-webkit-resizer {
        background-color: $resizer-color;
    }
    &:hover::-webkit-scrollbar-thumb {
        background-color: rgba($color, 0.2);
    }
    // IE
    scrollbar-face-color: transparent;
    scrollbar-shadow-color: $color;
    scrollbar-3dlight-color: $color;
    scrollbar-highlight-color: $color;
    scrollbar-shadow-color: $color;
    scrollbar-base-color: $color;
    scrollbar-track-color: $bg-color;
    scrollbar-arrow-color: $bg-color;
}